<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="/static/admin/css/default.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="/static/admin/easyui1.8.6/themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="/static/admin/easyui1.8.6/themes/icon.css" />
    <link rel="stylesheet" type="text/css" href="/static/admin/js/fancybox/source/jquery.fancybox.css" />
    <!--  <script type="text/javascript" src="/static/admin/easyui1.8.6/jquery.min.js"></script>-->
    <script type="text/javascript" src="/static/admin/js/fancybox/lib/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="/static/admin/easyui1.8.6/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="/static/admin/easyui1.8.6/locale/easyui-lang-zh_CN.js"></script>

    <script type="text/javascript" src="/static/admin/js/fancybox/source/jquery.fancybox.pack.js"></script>

    <!-- tinyMce富文本  -->
    <script src="/static/admin/js/tinymce/tinymce.min.js"></script>
    <style>
        .tox-tinymce-dialog{
            z-index: 9999 !important;
        }
        .tox-tinymce-aux{
            z-index: 9999 !important;
        }
        .tinymce.ui.FloatPanel{
            z-index: 99;
        }
    </style>
</head>
<body>
<div id="toolbar">
    <a class="easyui-linkbutton" onclick="add()" data-options="iconCls:'icon-add',plain:true">Add</a>
    <a class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">Edit</a>
    <a class="easyui-linkbutton" data-options="iconCls:'icon-help',plain:true">Help</a>
</div>
<table id="dataList"></table>


<div id="dlg" closed="true" modal="true" class="easyui-dialog" title="创建编辑" style="width:800px;height:400px;"
     data-options="iconCls:'icon-save',resizable:true,modal:true" buttons="#dlg-buttons">
    <div style="width: 100%;padding: 10px;">
    <form method="post" id="addForm">
        <div style="margin-bottom: 10px">
            <input type="text" class="easyui-textbox" style="width: 100%" name="title" data-options="label:'标题'" />
        </div>
        <div style="margin-bottom: 10px">
            <select id="cc" class="easyui-combobox" name="category_id" data-options="label:'类目'" style="width:200px;">
                <option value="">--选择类目--</option>
                <option value="1">类目1</option>
                <option value="2">类目2</option>
                <option value="3">类目3</option>
                <option value="4">类目4</option>
            </select>
            <input type="text" class="easyui-textbox" name="author" data-options="prompt:'投稿人'" style="width: 300px" />
        </div>

        <div style="margin-bottom: 10px">
            <textarea id="mceEditor" name="con"></textarea>
        </div>
    </form>
    </div>
</div>
<div id="dlg-buttons">
    <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-clear'" onclick="javascript:$('#dlg').dialog('close')">取消</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-save'" onclick="javascript:subAdd()">保存</a>
</div>
</body>
<script type="text/javascript">
    function add(){
        $('#dlg').dialog('open');
    }

    function subAdd(){
        $.post("{:url('admin/news/add')}",$('#addForm').serialize(),function(ee){
            console.log(ee);
        });
    }
var uploadUrl = "{:url('admin/pub/upload')}";
    tinymce.init({
        selector: '#mceEditor', //容器，可使用css选择器
        language:'zh_CN', //调用放在langs文件夹内的语言包
        toolbar: true, //工具栏
        menubar: true, //菜单栏
        branding:false, //右下角技术支持
        inline: false, //开启内联模式
        elementpath: false,
        min_height:400, //最小高度
        height: 800,  //高度
        skin: 'oxide',
        toolbar_sticky:true,
        visualchars_default_state:true, //显示不可见字符
        image_caption: true,
        images_upload_url: uploadUrl,
        paste_data_images: true,
        relative_urls : false,
        // remove_script_host : false,
        removed_menuitems: 'newdocument',  //清除“文件”菜单
        plugins: "lists,hr, advlist,anchor,autolink,autoresize,charmap,code,codesample,emoticons,fullscreen,image,media,insertdatetime,link,pagebreak,paste,preview,print,searchreplace,table,textcolor,toc,visualchars,wordcount", //依赖lists插件
        toolbar: 'bullist numlist anchor charmap emoticons fullscreen hr image insertdatetime link media pagebreak paste preview print searchreplace textcolor wordcount',
        //选中时出现的快捷工具，与插件有依赖关系
        // images_upload_url:'a.php', /*后图片上传接口*/ /*返回值为json类型 {'location':'uploads/jpg'}*/
        setup: function(editor){
            editor.on('change',function(){ editor.save(); });
        }
    });

    $('#dataList').datagrid({
        url:"{:url('admin/news/index')}",
        singleSelect:true,
        pagination:true,
        rownumbers:true,
        toolbar:'#toolbar',
        columns:[[
            {field:'title',title:'标题'},
            {field: 'thumb',title: '配图',align: 'center',formatter:function (val,row,index){
                    if(val==null){
                        return '-';
                    } else {
                        return '  <a class="fancybox-effects-c" href="' + val + '" title="头像预览">\n' +
                            '查看图片' +
                            '  </a>';
                    }
                }},
            {field:'comment_num',title:'评论数',width:100,align:'left'},
            {field:'hits',title:'点击量',width:100,align:'left'},
            {field:'category_id',title:'类目',width:100,align:'left'},
            {field: 'create_time',title: '发布时间'},
        ]]
    });

    $(".fancybox-effects-c").fancybox({
        wrapCSS    : 'fancybox-custom',
        closeClick : true,
        openEffect : 'none',
        helpers : {
            title : {
                type : 'inside'
            },
            overlay : {
                css : {
                    'background' : 'rgba(238,238,238,0.85)'
                }
            }
        }
    });


</script>
</html>